<%--
  Created by IntelliJ IDEA.
  User: css
  Date: 2018/7/5
  Time: 23:34
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Bootstrap 实例 - 水平表单</title>
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
    <script src="js/jquery.validate.min.js" type="text/javascript"></script>
    <script src="js/bootstrap.min.js" type="text/javascript"></script>
    <style>
        .error{
            color:red
        }
    </style>
    <script type="text/javascript">
        $(function(){
            $("#myform").validate({
                rules:{
                    "password":{
                        "required":true,
                    },
                    "newpassword":{
                        "required":true,
                        "rangelength":[6,12],

                    },
                    "renewpassword":{
                        "required":true,
                        "rangelength":[6,12],
                        "equalTo":"#newpassword"
                    }
                },
                messages:{
                    "upassword":{
                        "required":"密码不能为空",
                    },
                    "newpassword":{
                        "required":"不能为空",
                        "rangelength":"密码长度应为[6,12]",
                    },
                    "renewpassword":{
                        "required":"不能为空",
                        "rangelength":"密码长度应为[6,12]",
                        "equalTo":"两次输入不相等"
                    }
                }
            });
        });
    </script>
</head>
<body>
<div style="width: 1000px; margin: 0 auto; padding-top: 50px;">
    <form id="myform" action="${pageContext.request.contextPath}/repassword" class="form-horizontal" role="form">
        <div class="form-group">
            <label for="firstname" class="col-sm-2 control-label">旧密码</label>
            <div class="col-sm-10">
                <input type="password" name="password" class="form-control" id="firstname"
                       placeholder="请输入旧密码">
            </div>
        </div>
        <div class="form-group">
            <label for="lastname" class="col-sm-2 control-label">新密码</label>
            <div class="col-sm-10">
                <input type="password"  name="newpassword" class="form-control" id="newpassword"
                       placeholder="请输入新密码">
            </div>
        </div>
        <div class="form-group">
            <label for="lastname" class="col-sm-2 control-label">确认密码</label>
            <div class="col-sm-10">
                <input type="password" name="renewpassword" class="form-control" id="lastname"
                       placeholder="请确认密码">
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-default btn-lg">确定修改</button>
            </div>
        </div>
    </form>
</div>
</body>
</html>
